<template>
  <div>
    <el-tag
      v-for="item in valForMat"
      :type="type"
      :effect="effect"
      style="margin:0 3px 0 3px;"
    >{{ item }}</el-tag>
  </div>
</template>

<script>
export default {
  name: "MyTag",
  props: {
    valStr: {
      type: String,
      default: ""
    },
    type: {
      type: String,
      default: ""
    },
    effect: {
      type: String,
      default: "light"
    }
  },
  data() {
    return {};
  },
  computed: {
    valForMat() {
      if (
        this.valStr != null &&
        this.valStr != "" &&
        this.valStr != undefined
      ) {
        return this.valStr.split(",");
      } else {
        return [];
      }
    }
  }
};
</script>
